/**** reset ****/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

input::-moz-focus-inner /*Remove button padding in FF*/
{ 
    border: 0;
    padding: 0;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/**** main style ****/
        
        html                            { height: 100%}
	body		 		       	 { margin: 0px ; background-color: #b3b3b3; color: #454545; font-family: Tahoma,Arial,Verdana,helvetica,sans-serif; font-size: 14px; line-height: 1.4; height: 100%; }
	h1 					 { color: #363636; margin-top: 0px; margin-bottom: 0px; font-size: 24px; height: 24px;}
	h3					 { margin-top: 7px; margin-bottom: 7px; font-weight: normal; color: #a7a7a7;font-size: 16px; }
	a 		 			 { text-decoration: none; color: #20559a; }
	a:hover	 			 { text-decoration: underline; }
	a:focus				 { outline: none; }
	strong				 { font-weight: bold; }
       
        
/**** overlay box ****/
        .overlay			{display:none; z-index:10000; width:500px;}
        #msg-prompt                      { background: #fff; 
                                          -moz-box-shadow: 0px 0px 100px #000;
                                          -webkit-box-shadow: 0px 0px 100px #000;
                                          box-shadow: 0px 0px 100px #000;}
        
        #msg-prompt header              { height: 33px ; background: url('../images/bg_sub_nav.gif'); border-bottom: 1px solid #bebebe; padding-top: 13px; padding-left: 10px;text-shadow: 0 1px 0px #F7F7F7; }
        #msg-action           { text-align: right; background: #f4f4f4; border-top: 1px solid #bebebe; padding: 5px; height: 23px}
        #msg-action > a       { display: inline; padding: 2px 10px; margin: 5px; font-size: 12px }
        #msg-action > a:hover { text-decoration: none; }
        #msg-content          { padding-top: 15px; padding-left: 90px; min-height: 40px; background: url('../images/icon_notice.png') 25px 13px no-repeat; font-weight: bold }
/**** forms ****/

	label		 						 { font-size: 12px; float: left; height: 32px; padding-top: 14px; padding-right: 10px; width: 120px; text-align: right; display: block;}
	input					  			 { outline: none;font-size:12px;font-family: Tahoma }
	textarea							 { outline: none;font-size: 12px;font-family: Tahoma }
	select							 { outline: none;font-size: 12px;font-family: Tahoma}
	.standard_checkbox_form			 { margin: 16px 0 0 0;}
	.standard_text_form				 { float: left; height: 12px;margin-top: 9px; width: 500px; border: 1px solid #bebebe; padding: 7px;
									   box-shadow: inset 0px 3px 0px 0px #e5e5e5;}
        
							
	.standard_text_form:focus		{ border: 1px solid #939393; background: #f8f8f8; box-shadow: inset 0px 3px 0px 0px #d4d4d4;  }
	.standard_select_form			{ float: left; height: 26px;margin-top: 9px; border: 1px solid #bebebe; padding: 4px;
									   box-shadow: inset 0px 3px 0px 0px #e5e5e5;}
	.standard_select_form:focus		{ border: 1px solid #939393; background: #f8f8f8; box-shadow: inset 0px 3px 0px 0px #d4d4d4;}
	.standard_textarea_form			{ float: left; height: 61px;  min-height: 61px; margin-top: 8px; margin-bottom: 8px;  width: 500px; border: 1px solid #bebebe; resize: vertical; padding: 7px;
									  box-shadow: inset 0px 3px 0px 0px #e5e5e5;}		
	.standard_textarea_form:focus 	{ border: 1px solid #939393; background: #f8f8f8; box-shadow: inset 0px 3px 0px 0px #d4d4d4;  }

        
.button_blue , .button_grey{
font-size: 12px;
cursor: pointer; 
height: 25px;
margin: 9px 0 0 0;
padding: 5px 10px;
font-family: Helvetica, Arial, sans-serif;
text-decoration: none;
font-weight: bold;
line-height: 1;
color: white;
text-shadow: 0 -1px 1px rgba(0,0,0,.3);
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.5), inset 0 1px 1px rgba(255,255,255,.5);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.5), inset 0 1px 1px rgba(255,255,255,.5);
-o-box-shadow: 0 1px 2px rgba(0,0,0,.5), inset 0 1px 1px rgba(255,255,255,.5);
box-shadow: 0 1px 2px rgba(0,0,0,.5), inset 0 1px 1px rgba(255,255,255,.5);
}

.button_grey
{
    background-image: -webkit-gradient(linear, 0% 0%, 0%100%, from(#e6e6e6), to(#cecece));
    background-image: -moz-linear-gradient(0% 100% 90deg,#cecece, #e6e6e6);
    background-color: #e6e6e6;
    border: 1px solid #989898;
}

.button_grey:hover, .button_grey:focus {
background-image: -webkit-gradient(linear, 0% 0%, 0%100%, from(#d5d5d5), to(#b2b2b2));
background-image: -moz-linear-gradient(0% 100% 90deg,#b2b2b2, #d5d5d5);
background-color: #e6e6e6;
color: white;
text-decoration: none;
}

.button_blue
{
    background-image: -webkit-gradient(linear, 0% 0%, 0%100%, from(#52A8E8), to(#377AD0));
    background-image: -moz-linear-gradient(0% 100% 90deg,#377AD0, #52A8E8);
    background-color: #52A8E8;
    border: 1px solid #20559A;
}

.button_blue:hover, .button_blue:focus {
background-image: -webkit-gradient(linear, 0% 0%, 0%100%, from(#54A1D8), to(#1967CA));
background-image: -moz-linear-gradient(0% 100% 90deg,#1967CA, #54A1D8);
background-color: #52A8E8;
color: white;
text-decoration: none;
}

.button_blue:active {
/*background: #2D7CD1;*/
-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,.5), 0 1px 1px rgba(255,255,255,.7);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.5), 0 1px 1px rgba(255,255,255,.5);
-o-box-shadow: 0 1px 2px rgba(0,0,0,.5), 0 1px 1px rgba(255,255,255,.5);
box-shadow: 0 1px 2px rgba(0,0,0,.5), 0 1px 1px rgba(255,255,255,.5);
color: white;
}

/**** main_page ****/
        
        #ajax_loader                                    { background: #bebebe; width: 100%; height: 100%; position: fixed; top: 20px; z-index: 2; opacity: .5; display: none; }
        #ajax_loader > img                              { position: absolute; top: 50%; left: 50%; margin-top: -5px; margin-left: -22px; }
	#main_page_forms				{ background: #fff; height: 164px; width: 250px; border: 1px solid #888888; position: absolute; top : 335px; left: 50%; margin-left: -500px; overflow: hidden ;
									 -webkit-border-radius: 5px;
									 -moz-border-radius: 5px;
								 	 -o-border-radius: 5px;
								  	 border-radius: 5px;}								
	#main_page_forms li				{ padding-left: 8px; padding-right: 8px  }
	#main_page_forms li .standard_text_form         { width: 218px }
	#main_page_forms .button_blue 	{ width: 100px; float: right; margin-bottom: 9px }
	#main_page_forms a				{ margin-top: 9px; margin-left: 9px; color: #454545; font-size: 12px; cursor: pointer  }
	#main_page_forms  div				{ position: relative }
	#main_page_navigation			{ height: 47px ; background: url('../images/bg_sub_nav.gif'); border-bottom: 1px solid #bebebe;}
	#main_page_navigation ul			{  position: absolute; left: 50%; margin-left: -200px; cursor: pointer }
	#main_page_navigation li			{ display: block;float: left; border-right: 1px solid #bebebe}
	#main_page_navigation li:first-child	{ border-left: 1px solid #bebebe }
	#main_page_navigation li:hover	{ background: #c9c9c9}
	#main_page_navigation a			{ display: block;  width: 50px;height: 47px;  }	
	#main_page_navigation .active	{ height: 48px; background: #fff; }
	#main_page_navigation .active:hover	{ background: #fff; }							 								
	#main_page_navigation span		{ display: none }	
	
	#main_page_content				{ background: #fff; height: 150px; border-bottom: 1px solid #5f5f5f}
	#main_page_content div			{ padding: 20px;position: absolute; left: 50%; margin-left: -220px; display: none }
	#main_page_content .active		{ display: block }
	
	#main_page_search 				{ height: 30px;padding-top: 13px; background: #dcdcdc;border-top: 1px solid #888888;clear: both;
									 -webkit-border-bottom-left-radius: 5px;
									 -webkit-border-bottom-right-radius: 5px;
									 -moz-border-radius-bottomleft: 5px;
									 -moz-border-radius-bottomright: 5px;
								 	 -o-border-radius: 5px;
								  	 border-bottom-left-radius: 5px;
									 border-bottom-right-radius: 5px;} 
									 
        #main_page_forms #main_page_recovery_info		{ height: 73px; padding-left: 18px; padding-right: 18px;  padding-top: 10px; background: #dcdcdc;border-top: 1px solid #888888;clear: both; font-size: 12px; line-height: 1.4;
									 -webkit-border-bottom-left-radius: 5px;
									 -webkit-border-bottom-right-radius: 5px;
									 -moz-border-radius-bottomleft: 5px;
									 -moz-border-radius-bottomright: 5px;
								 	 -o-border-radius: 5px;
								  	 border-bottom-left-radius: 5px;
									 border-bottom-right-radius: 5px;}
	#main_page_search > input			{ float: none; margin-bottom: 9px}
        #main_page_recovery a                   { position:relative; top: 13px }
	
	footer                              { width: 1200px;  padding: 10px 0px; margin: 0px auto; text-align: right;color: #474747;text-shadow: #dedede 0 1px 0;font-size: 12px; }
	footer h1							{ position: absolute; left: 50%; margin-left: -505px; top: -1px; font-size: 52px; font-family: Providence}
	footer a							{ color: #474747}
        footer li                               { display: inline; margin-left: 15px }
	#desktop_icon_mainpage			{ background-image: url('../images/icon_desktop_mainpage.png'); background-repeat: no-repeat; background-position: center}
	#business_icon_mainpage			{ background-image: url('../images/icon_business.png'); background-repeat: no-repeat; background-position: center}
	#group_icon_mainpage			{ background-image: url('../images/icon_group.png'); background-repeat: no-repeat; background-position: center}
	#lightbulb_icon_mainpage		{ background-image: url('../images/icon_lightbulb.png'); background-repeat: no-repeat; background-position: center}
        
       
/**** screen ****/

        #screen            { position: absolute; right: 30px; top: 0px;}
        #screen_reflection { position: absolute; right: 30px; top: 1px;} 
        #screen_bar        { position: absolute; right: 61px; top: 27px;}
        #screen_color      { position: absolute; right: 61px; top: 27px; height: 176px; width: 278px; background: #304580}
        #screen_net        { position: absolute; right: 61px; top: 27px; height: 176px; width: 278px; background:  url('../images/screen_net.png')}
        #screen_wallpaper  { position: absolute; right: 61px; top: 27px; height: 176px; width: 278px; }

/**** header ****/

        
	body > header 	 		 	{ background: url('../images/bg_header.gif'); height: 25px; width: 100%; position: fixed; top: 0px; z-index: 4}
	body > header > a 		 	{ display: block; width: 100px; height: 25px; background: url('../images/mydesk_logo.png'); margin-left: 20px;}
	body > header > a > span 	{ display: none; }
	
	#sub_nav 				{ background: url('../images/bg_sub_nav.gif'); height: 62px; width: 100%; position: fixed; top: 25px; z-index: 999; }
	#shadow_panel 	 		{ background: url('../images/shadow_panel.png'); height: 53px; width: 100%;position: fixed; top: 24px; z-index: 2; }
	
/**** menu ****/

	.main_navigation			{ position: fixed; top: 0px; left: 130px; z-index: 4}		
	.main_navigation > ul 		{ margin: 0px; padding: 0px; height: 25px;}
	.main_navigation li 			{ display: inline; }
	.main_navigation li > a 		{ display: block; height: 24px; float: left; width: 24px; margin-left: 10px}
	.main_navigation li > a:hover	{ background: #fff; }
	.main_navigation li > a > span 	{ display: none }
        .main_navigation li > .active   { background-color: #fff; border-bottom: 1px solid #fff}
	#search_icon				{ background-image: url('../images/icon_nav_search.png'); background-repeat: no-repeat; background-position: center}
	#desktop_icon                           { background-image: url('../images/icon_nav_desktop.png'); background-repeat: no-repeat; background-position: center}
        #profile_icon 				{ background-image: url('../images/icon_nav_profile.png'); background-repeat: no-repeat; background-position: center}
	#message_icon 				{ background-image: url('../images/icon_nav_message.png'); background-repeat: no-repeat; background-position: center}
	#notification_icon 			{ background-image: url('../images/icon_nav_notification.png'); background-repeat: no-repeat; background-position: center}
	#setting_icon 				{ background-image: url('../images/icon_nav_setting.png'); background-repeat: no-repeat; background-position: center}
	#logout_icon 				{ background-image: url('../images/icon_nav_logout.png'); background-repeat: no-repeat; background-position: center;}
        #contact_icon 				{ background-image: url('../images/icon_nav_contact.png'); background-repeat: no-repeat; background-position: center;}

/**** profile navigation ****/

	.profile_navigation			{ z-index: 1;position: fixed; left: 0px; top: 50%; margin-top: -40px ; width: 25px; background: #d3d3d3; border-top: 1px solid #878787;border-bottom: 1px solid #878787;border-right: 1px solid #878787;}
	.profile_navigation > ul 		{ margin: 0px; padding: 0px; width: 25px;}
	.profile_navigation li > a              { display: block; height: 25px; width: 25px; }
	.profile_navigation li > a:hover	{ background: #fff; }
	.profile_navigation li > a > span 	{ display: none }
        .profile_navigation li .active          { background: #fff; border-right: 1px solid #fff;}
        #profile_icon_mini                      { background-image: url('../images/icon_profile_mini.png'); background-repeat: no-repeat; background-position: 4px; }
	#desktop_icon_mini			{ background-image: url('../images/icon_desktop_mini.png'); background-repeat: no-repeat; background-position: 4px;}
	#message_icon_mini			{ background-image: url('../images/icon_message_mini.png'); background-repeat: no-repeat; background-position: 4px}
	#friend_icon_mini			{ background-image: url('../images/icon_friend_mini.png'); background-repeat: no-repeat; background-position: 4px;}
        #message_box                            { z-index: 1;display:none; position: fixed; top:50% ; margin-top: -14px; left: 26px; background: #fff; width: 660px;box-shadow: 0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000; -webkit-box-shadow: 0px 0px 5px #000;}
        #search_box                             { z-index: 3; display:none; position: fixed; top:24px ; left: 140px; background: #fff; box-shadow: 0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000; -webkit-box-shadow: 0px 0px 5px #000;}
        #inbox_box                              { z-index: 3; display:none; position: fixed; top:24px ; left: 276px; background: #fff; box-shadow: 0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000; -webkit-box-shadow: 0px 0px 5px #000;}
        #invitation_box                         { z-index: 3; display:none; position: fixed; top:24px ; left: 242px; background: #fff; box-shadow: 0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000; -webkit-box-shadow: 0px 0px 5px #000;}
        .content_box                            {  padding: 0px 10px 10px 10px; width: 316px;}
        .link_box                               {  font-size: 12px;padding: 10px; text-align: center; font-weight: bold; background-color: #f4f4f4; border-top: 1px solid #bebebe ;}
        .info_box                               { border-bottom: 1px dotted #bebebe; font-size: 12px; padding: 10px; margin-bottom: -1px }
        .user_list_box li                       { border-top: 1px dotted #bebebe; height: 46px }
        .user_list_box li div                   { float: left; padding-left: 10px;}
        .user_list_box li .action_button     { text-align: right; height: 35px; padding-top: 12px}
        .user_list_box li .action_button a { display: inline; color: #fff; float: none; }
        .user_list_box li a                     { display: block; text-decoration: none; color: inherit;}
        .user_list_box li a:hover               { background-color: #f4f4f4; }           
/**** content ****/

	#content 							{ margin: 0px auto; background: #363636 url('../images/shadow_aside_left.png') repeat-y 250px; position: relative; top: 60px;  
										  -moz-box-shadow: 0 0 3px 3px #888;
										  -webkit-box-shadow: 0 0 3px 3px #888;
										  box-shadow: 0 0 3px 3px #888;
										}
	#content  header 					{ height: 33px ; background: url('../images/bg_sub_nav.gif'); border-bottom: 1px solid #bebebe; padding-top: 13px; padding-left: 10px;text-shadow: 0 1px 0px #F7F7F7; } 
	#content   aside						{ width: 300px; float: left; }
	#content > section, #content > form > section 		{ width: 900px; float: left; }
	#content   .header_menu 		 		{ margin: 0px; height: 46px ; background: url('../images/bg_sub_nav.gif'); border-bottom: 1px solid #bebebe; padding: 0px; position:relative; z-index: 1}
	#content   .header_menu 	 li  	 		{ display: inline;}
	#content   .header_menu 	 li a	 		{ display: block; height: 31px; width: 115px; float: left; text-align: center; padding-top: 15px; border-right: 1px solid #bebebe; color: #454545; text-shadow: 0 1px 0px #F7F7F7}
	#content   .header_menu 	 .active 	{ height: 32px; background: #e8e8e8 url('../images/bg_header_menu_active.gif') bottom center no-repeat; text-decoration: none; border-bottom: none  }

/**** content > aside ****/

	aside > header 		{ height: 33px ; background: url('../images/bg_sub_nav.gif'); border-bottom: 1px solid #bebebe; padding-top: 13px; padding-left: 10px;border-right: 1px solid #bebebe;text-shadow: 0 1px 0px #F7F7F7; } 
	aside > ul 			{ margin: 0px; padding: 0px; background: url('../images/shadow_aside_top.png') bottom; padding-bottom: 47px; list-style: none}
	aside > ul > li 			{ height: 46px; background:  url('../images/bg_list.gif'); border-right: 1px solid #bebebe; border-bottom: 1px solid #bebebe; }
	aside > ul > li:hover	{ background:  url('../images/bg_list_hover.gif');}
	aside > ul > li img  	{ float: left;}  
	aside .active				{ padding-left: 20px; background: #fff  url('../images/bg_list_active.gif') no-repeat left center; font-weight: bold }
	aside .active:hover		{ background: #fff url('../images/bg_list_active.gif') no-repeat left center; }
	aside .active .mini_info	{ font-weight: normal}
        aside > div                     { background: #fff; padding: 10px; border-bottom: 1px solid #bebebe; border-right: 1px solid #bebebe; font-size: 12px}
        aside p                         { margin-top: 12px;}
        aside .standard_text_form         { max-width: 263px; min-width: 227px; float:none }
        aside li a                      { color: #454545}
        aside li a:hover                      { text-decoration:none}

/**************************
/* content > section > div*
/**************************/

	#content > section > div,
        #content > form > section > div { background: #fff;  }


/**********	
/*	.list *
/**********/

.list 											{ margin: 0px; padding: 0px; list-style: none}
.list > li 										{ border-bottom: 1px solid #bebebe; }
.list_main_container							{ height: 46px; background:  url('../images/bg_list.gif'); }
.list_main_container:hover						{ background:  url('../images/bg_list_hover.gif'); }
.list_main_container > img						{ float: left }
.list_main_container > div, #mini_contact_list div             { float: left; padding-left: 15px; height: 47px; }
.list_main_container > div  .mini_name				{ margin-left: 0px;}
.list_main_container > div  .mini_info				{ margin-left: 0px;}
.list_main_container > .list_standard_entre 		{ padding-top: 16px; height: 31px; font-size: 12px }
.list_main_container > .list_user_link, 
    #mini_contact_list .list_user_link, 
    .user_list_box .list_user_link                {float: left; padding-left: 0px; background-color: #ddd; border-left: 1px solid #bebebe; border-bottom: 1px solid #bebebe; border-right: 1px solid #bebebe; height: 46px}
.list_main_container > .list_user_link a:hover,
 #mini_contact_list .list_user_link a:hover        { background-color: #fff}
.list_white_container							{ border-left: 47px solid #f4f4f4; }
.message                                                                { padding: 20px; padding-left: 15px; font-size: 12px ; border-left: 47px solid #f4f4f4; line-height: 1.4;}
.message > h1                                                           { font-size: 14px; color:#000000; margin-bottom: 15px; font-weight: bold}
.message p                                 { padding-top: 5px;padding-bottom:5px}
.list .active									{ background: #fff; border-bottom: 1px dotted #bebebe}
.list .unread									{ font-weight: bold }
.list .unread .mini_info						{ font-weight: normal}

.text_list      { margin-left: 10px;}
.text_list li   { margin-top: 4px;margin-bottom: 6px; margin-left: 10px; list-style-type:disc}
/***********
/*	action *
/***********/
        .action         {margin-top: 2px;}
        
	.delete		{ display: block; width: 12px; height: 12px; background: url('../images/icon_cross.png') top left }
	.delete:hover	{ background-position: top right}
        .edit		{ display: block; width: 12px; height: 12px; background: url('../images/icon_edit.png') top left }
	.edit:hover	{ background-position: top right}
	
/**** profile ****/

	#profile > div > section > header { height: 31px;  background: url('../images/bg_sub_nav.gif');margin-top: 10px; padding-top: 15px; padding-left: 10px; border: 1px solid #bebebe; text-shadow: 0 1px 0px #F7F7F7; 
									-webkit-border-top-radius: 5px;
									-moz-border-radius-top: 5px;
									border-top-right-radius: 5px;
									border-top-left-radius: 5px;}
	.profile_info_container { border-bottom: 1px solid #bebebe; border-right: 1px solid #bebebe; border-left: 1px solid #bebebe;padding: 10px 0px; }								
	 dl { margin-left: 20px; font-size: 12px; margin: 0px; padding: 3px 10px;	line-height: 1.4; }
	 dl > dt { float: left;color: #800000; width: 120px }
	 dl > dd { margin-left: 120px;  }


	#profile > div	{ background-color: #fff; padding: 10px; }
	.profile_image    { border: 1px solid #bebebe; width: 114px; height: 114px; position: relative;} 

/*text-shadow: 0 1px 1px #F7F7F7;*/
.mini_name { height: 20px; margin: 0 0 0 0px; padding-top: 7px}
.mini_info { height: 20px; margin: 0 0 0 0px;font-size: 10px; color: #999999; }

#user_wallpaper { margin-left: 130px}
.desktop        { width: 1600px; height:900px; position: fixed; top: 25px; left: 50%; margin-left: -800px}
.body           { width: 100%; height: 100%}
#desktop_list   { width: 500px ;float: left;}

.delete_photo   { z-index: 1;display: block; padding: 3px 5px; padding-left: 5px; position: absolute; right: 0px; bottom: 0px; background-color: rgba(0,0,0,0.7); ; color: #fff; font-size: 10px}
.desktop_link   { display: block; width: 25px; height: 23px; background: url('../images/icon_desktop_mini.png') center center no-repeat }
.profile_link   { display: block; width: 25px; height: 23px; background: url('../images/icon_profile_mini.png') center center no-repeat }


/* mini contact list */
#mini_contact_list p { margin: 0px}
